<!--

    Copyright (C) 2015 The Gravitee team (http://gravitee.io)

    Licensed under the Apache License, Version 2.0 (the "License");
    you may not use this file except in compliance with the License.
    You may obtain a copy of the License at

            http://www.apache.org/licenses/LICENSE-2.0

    Unless required by applicable law or agreed to in writing, software
    distributed under the License is distributed on an "AS IS" BASIS,
    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
    See the License for the specific language governing permissions and
    limitations under the License.

-->
<div class="gv-forms" layout="column">
  <h1>API Portal Informations</h1>
  <div class="gv-form">
    <h2></h2>
    <div class="gv-form-content" layout="column">
      <h3>Add extra informations</h3>
      <md-input-container class="gv-input-container-dense">
        <md-checkbox
          ng-model="$ctrl.settings.portal.apis.apiHeaderShowTags.enabled"
          aria-label="Show Tags"
          ng-disabled="$ctrl.isReadonlySetting('portal.apis.apiheader.showtags.enabled')"
          ng-change="$ctrl.saveShowTags()"
        >
          Show tags list in the API header
          <md-tooltip ng-if="$ctrl.isReadonlySetting('portal.apis.apiheader.showtags.enabled')"
            >{{$ctrl.providedConfigurationMessage}}</md-tooltip
          >
        </md-checkbox>
      </md-input-container>
      <md-input-container class="gv-input-container-dense">
        <md-checkbox
          ng-model="$ctrl.settings.portal.apis.apiHeaderShowCategories.enabled"
          aria-label="Show Categories"
          ng-disabled="$ctrl.isReadonlySetting('portal.apis.apiheader.showcategories.enabled')"
          ng-change="$ctrl.saveShowCategories()"
        >
          Show categories list in the API header
          <md-tooltip ng-if="$ctrl.isReadonlySetting('portal.apis.apiheader.showcategories.enabled')"
            >{{$ctrl.providedConfigurationMessage}}</md-tooltip
          >
        </md-checkbox>
      </md-input-container>

      <h3>Configure the informations list</h3>
      <md-table-container>
        <table md-table class="gv-table-dense">
          <thead md-head>
            <tr md-row>
              <th width="1%" nowrap md-column>Name</th>
              <th md-column>Value</th>
              <th md-column width="76px" nowrap></th>
              <th md-column width="48px" nowrap></th>
            </tr>
          </thead>
          <tbody md-body>
            <tr md-row ng-repeat="header in $ctrl.apiPortalHeaders">
              <td md-cell width="1%" nowrap><a ng-click="$ctrl.updateHeader(header)">{{header.name}}</a></td>
              <td md-cell><code>{{header.value}}</code></td>
              <td md-cell width="76px" nowrap layout="row" layout-align="center center">
                <div permission permission-only="'environment-api_header-u'">
                  <ng-md-icon ng-if="!$first" icon="arrow_upwards" ng-click="$ctrl.upward(header)"></ng-md-icon>
                  <ng-md-icon ng-if="!$last" icon="arrow_downward" ng-click="$ctrl.downward(header)"></ng-md-icon>
                </div>
              </td>
              <td md-cell width="48px" nowrap>
                <ng-md-icon permission permission-only="'environment-api_header-d'" icon="delete" ng-click="$ctrl.deleteHeader(header)">
                  <md-tooltip md-direction="top" md-visible="false">Delete</md-tooltip>
                </ng-md-icon>
              </td>
            </tr>
          </tbody>
        </table>
      </md-table-container>

      <h3>API List Page</h3>
      <md-input-container class="gv-input-container-dense">
        <md-checkbox
          ng-model="$ctrl.settings.portal.apis.promotedApiMode.enabled"
          aria-label="Show Promoted API"
          ng-disabled="$ctrl.isReadonlySetting('portal.apis.promotedApiMode.enabled')"
          ng-change="$ctrl.savePromotedApiMode()"
        >
          Show promoted API banner
          <md-tooltip ng-if="$ctrl.isReadonlySetting('portal.apis.promotedApiMode.enabled')"
            >{{$ctrl.providedConfigurationMessage}}</md-tooltip
          >
        </md-checkbox>
      </md-input-container>
    </div>
  </div>
</div>

<md-button
  permission
  permission-only="'environment-api_header-c'"
  aria-label="Add"
  class="md-fab md-fab-bottom-right md-fab-scrollable"
  ng-class="{'gv-help-displayed': $ctrl.$rootScope.helpDisplayed}"
  ng-click="$ctrl.createHeader()"
>
  <md-tooltip md-direction="top" md-visible="false">Add a new header</md-tooltip>
  <ng-md-icon icon="add"></ng-md-icon>
</md-button>
